@import "./icon.scss";
@import "./variable.scss";
@import "./reset.scss";
@import "./list.scss";
@import "./color.scss";
@import "./info.scss";
@import "./components.scss";
.fr {
  float: right;
}

.fl {
  float: left;
}

.clear {
  &::after {
    content: ' ';
    display: block;
    clear: both;
    zoom: 1;
  }
}

.clearfix {
  &::before {
    content: ' ';
    display: table;
  }
}
.w90 {
  display: inline-block;
  width: 90px;
}
.w100 {
  width: 100px;
}
.w200 {
  width: 200px;
}
.w300 {
  width: 300px;
}

.block {
  display: block;
}

.ib {
  display: inline-block;
}

.top{
  vertical-align: top;
}

.middle {
  vertical-align: middle;
}

.ft0 {
  font-size: 0;
}

.pt {
  cursor: pointer;
}

.mgt5 {
  margin-top: 5px;
}

.mgt10 {
  margin-top: 10px;
}

.mgt15 {
  margin-top: 15px;
}

.mgt20 {
  margin-top: 20px;
}

.mgt30 {
  margin-top: 30px;
}


.mgt40 {
  margin-top: 40px;
}
.mgt100 {
  margin-top: 100px;
}

.mgl5 {
  margin-left: 5px;
}

.mgl10 {
  margin-left: 10px;
}

.mgl15 {
  margin-left: 15px;
}

.mgr5 {
  margin-right: 5px;
}

.mgr10 {
  margin-right: 10px;
}

.mgr15 {
  margin-right: 15px;
}

.mgb5 {
  margin-bottom: 5px;
}

.mgb10 {
  margin-bottom: 10px;
}

.mgb15 {
  margin-bottom: 15px;
}

.mgb20 {
  margin-bottom: 20px;
}

.mgb25 {
  margin-bottom: 25px;
}

.mgb30 {
  margin-bottom: 30px;
}

.mgb40 {
  margin-bottom: 40px;
}
.mgb60 {
  margin-bottom: 60px;
}


.mgr20 {
  margin-right: 20px;
}

.mgl20 {
  margin-left: 20px;
}

.mgl40 {
  margin-left: 40px;
}

.mgl60 {
  margin-left: 60px;
}

.mgl100 {
  margin-left: 100px;
}

.pdl5 {
  padding-left: 5px;
}

.pdl10 {
  padding-left: 10px;
}

.pdl15 {
  padding-left: 15px;
}

.pdl20 {
  padding-left: 20px;
}

.pdl80 {
  padding-left: 80px;
}

.pdr10 {
  padding-right: 10px;
}

.pdr15 {
  padding-right: 15px;
}

.pdr20 {
  padding-right: 20px;
}

.pdt30 {
  padding-top: 30px;
}

.pdb10 {
  padding-bottom: 10px;
}

.txtC {
  text-align: center;
}

.txtL {
  text-align: left;
}

.txtR {
  text-align: right;
}

.xy-ellipsis-1{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.color-666{
  color: #666
}
.color-606266 {
  color: #606266;
}
.color-303133{
  color: #303133;
}
.color-red{
  color: $xy-color-danger;
}

.pointer{
  cursor: pointer;
}

.verify-error {
  &.el-input {
    & input {
      border: 1px solid #FA5555;
    }
  }
}

.required {
  color: #ff6d6d;
  display: inline-block;
  vertical-align: middle;
  margin-left: 5px;
}

.view-container {
  padding: 20px;
}

.view-title {
  font-size: 16px;
  color: #303133;
}

.view-breadcrumb {
  font-size: 0;
  // border-top: 1px solid #dfdfdf;
  // margin-top: 20px;
  padding-bottom: 15px;
  display: inline-block;
  & span {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    font-size: 16px;
    color: #151515;
    margin-right: 4px;
    & span {
      color: $xy-text-color-secondary;
      margin-left: 8px;
    }
  }
  & a {
    font-size: 16px;
    color: $xy-text-color-secondary;
    display: inline-block;
    height: 30px;
    line-height: 30px;
    & i {
      margin-right: 10px;
      vertical-align: top;
      margin-top: 6px;
      line-height: 16px;
    }
    &:hover {
      color: #151515;
      text-decoration: underline !important;
      & span {
        color: #151515;
      }
    }
  }
}

.collapse-header {
  height: 54px;
  padding: 0 15px;
  line-height: 54px;
  background-color: #f2f5f6;
  font-size: 14px;
  color: #333
}

.menu-container {
  & .el-submenu__title {
    border-left: 3px solid $xy-background-dark;
    &:hover {
      border-left: 3px solid rgb(70, 78, 98);
    }
  }
}

.app-right-tabs {
  border-bottom: 1px solid #E4E7ED;
  & .el-tabs__header {
    border: none;
  }
  & .el-tabs__nav-scroll {
    padding-top: 10px;
  }
  & .el-tabs__item,
  & .el-tabs__nav {
    margin: 0;
    height: 39px;
  }
  & .el-tabs__item {
    width: 120px !important;
    box-shadow: none !important;
    padding: 0 10px 0 10px !important;
    background-color: #F2F5F6;
    &.is-active {
      background-color: #FFF;
      & .el-icon-close {
        display: none;
      }
    }
    &:hover {
      color: #333;
      & .el-icon-close {
        display: inherit;
      }
      &.is-active {
        color: #409EFF;
      }
    }
  }
  & .el-tabs__nav {
    margin-left: 20px;
  }
  & .el-icon-close {
    right: 10px !important;
    top: 12px !important;
    &:hover {
      background-color: $xy-color-danger;
    }
    position: absolute !important;
  }
  & .el-tabs__nav-wrap {
    margin-bottom: 0 !important;
    padding: 0 0 0 20px;
  }
  & .el-tabs__nav-prev,
  & .el-tabs__nav-next {
    display: none !important;
  }
  .icon-scrappy-more{
    &:hover{
      color: $xy-color-main!important;
    }
  }
}

/* * 赵卓斌 <zhaozb@sq580.com> 2018-04-09 - STR
   *@标题
   *页面菜单*/

.menu-title {
  color: $xy-text-color-primary;
  font-size: 16px !important;
}

/* @字体
 主要文字*/

.text-main {
  color: $xy-text-color-primary;
  font-size: 14px !important;
}

/* 常规文字*/

.text-regular {
  color: $xy-text-color-regular;
  font-size: 14px !important;
}

.text-placeholder {
  color: $xy-text-color-placeholder;
  font-size: 14px !important;
}

/* 常规小文字*/

.small-text-regular {
  color: $xy-text-color-regular;
  font-size: 12px !important;
}

.small-text-placeholder {
  color: $xy-text-color-placeholder;
  font-size: 12px !important;
}

/* @字体颜色*/

.font-main {
  color: $xy-color-main;
}

.font-success {
  color: $xy-color-success;
}

.font-warning {
  color: $xy-color-warning;
}

.font-danger {
  color: $xy-color-danger;
  &:hover,
  &:active,
  &:focus {
    color: $xy-color-danger;
  }
}

.font-disable {
  cursor: default;
  color: $xy-text-color-placeholder;
  &:hover,
  &:active,
  &:focus {
    color: $xy-text-color-placeholder;
  }
}

/* @按钮
// 大按钮*/

.large-btn {
  font-size: 14px;
  border-radius: 4px;
  line-height: 37px;
  padding: 0 20px;
  font-weight: normal;
}

.medium-btn {
  font-size: 14px;
  border-radius: 4px;
  line-height: 31px;
  padding: 0 15px;
  font-weight: normal;
}

.small-btn {
  font-size: 12px;
  border-radius: 3px;
  line-height: 25px;
  padding: 0 15px;
  font-weight: normal;
}

.icon-scrappy-load {
  vertical-align: top;
  display: inline-block;
  font-size: 14px;
  -webkit-animation: loadding 1s linear infinite;
}

@-webkit-keyframes loadding {
  0% {
    -webkit-transform: rotate(0)
  }
  100% {
    -webkit-transform: rotate(180deg)
  }
  100% {
    -webkit-transform: rotate(360deg)
  }
}

/* input框红点样式*/

.xy-input-required {
  position: relative;
  &:after {
    content: '*';
    color: $xy-color-danger;
    position: absolute;
    right: -15px;
    top: 1px;
  }
}

/* 赵卓斌 <zhaozb@sq580.com> 2018-04-09 - END*/

.el-button--primary{
  background-color: $xy-color-main;
  border-color: $xy-color-main;
  &:focus, &:hover{
    background-color: darken($xy-color-main, 10%);
    border-color: darken($xy-color-main, 10%);
  }
}
.el-button--danger{
  background-color: $xy-color-danger;
  border-color: $xy-color-danger;
  &:focus, &:hover{
    background-color: darken($xy-color-danger, 10%);
    border-color: darken($xy-color-danger, 10%);
  }
}
.el-button--success{
  background-color: $xy-color-success;
  border-color: $xy-color-success;
  &:focus, &:hover{
    background-color: darken($xy-color-success, 10%);
    border-color: darken($xy-color-success, 10%);
  }
}
.el-button--warning{
  background-color: $xy-color-warning;
  border-color: $xy-color-warning;
  &:focus, &:hover{
    background-color: darken($xy-color-warning, 10%);
    border-color: darken($xy-color-warning, 10%);
  }
}
.el-button{
  border-radius: 4px;
  height: 34px;
  line-height: 34px;
  padding: 0px 20px;
  min-width: 80px;
}
.el-dialog{
  .el-button{
    border-radius: 4px;
    height: 34px!important;
    line-height: 34px!important;
    padding: 0px 20px!important;
    min-width: 80px!important;
  }
}

.el-button--text{
  min-width: auto!important;
  height: 34px;
  line-height: 34px;
  padding-left: 0;
  padding-right: 0;
  min-width: 80px;
}
.el-message-box__btns{
  .el-button{
    min-width: 60px;
  }
}

.el-button--large{
  border-radius: 4px;
  height: 40px;
  line-height: 40px;
  padding: 0px 20px;
  font-size: 14px;
}
.el-button--medium{
  border-radius: 4px;
  height: 34px;
  line-height: 34px;
  padding: 0px 15px;
  font-size: 14px;
}
.el-button--small{
  border-radius: 3px;
  height: 28px;
  line-height: 28px;
  font-size: 12px;
  padding: 0px 15px;
}

.el-icon-warning{
  vertical-align: middle;
  color: $xy-color-warning;
}

.el-popover{
  .el-button{
    min-width: 60px;
    height: 28px;
    line-height: 28px;
  }
}

.tag{
  border: 1px solid $xy-color-success;
  border-radius: 3px;
  color: $xy-color-success;
  padding: 0 3px;
  font-size: 12px;
  display: inline-block;
  height: 20px;
  line-height: 20px;
  background: #EFF8F5;
  i{
    font-size: 12px!important;
    vertical-align: initial;
    margin-right: 4px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    display: inline-block;
  }
}
.tag-danger{
  border-color: $xy-color-danger;
  color: $xy-color-danger;
  background: #FEEEEE;
}
.tag-info{
  border-color: $xy-text-color-placeholder;
  color: $xy-text-color-secondary;
  background: #fff;
}

.el-input--medium{
  width: 224px;
}
//TODO 这样写会覆盖别人的样式
// .el-date-editor{
//   .el-input__inner{
//     width: 224px;
//   }
// }

.sign-maolin{
  .el-date-editor{
    .el-input__inner{
      width: 224px!important;
    }
  }
}
.el-icon-arrow-up:before {
  content: "\E60C";
}


.form-group{
  .is-checked{
    .el-checkbox__label{
      color: $xy-color-main!important;
    }
  }
  .el-checkbox.is-bordered {
    height: 34px;
    line-height: 34px;
    border-radius: 4px;
    padding: 0 14px;
    font-size: 14px;
    .el-checkbox__label{
      font-size: 14px;
      color: $xy-text-color-regular;
    }
  }
}
.xy-modal {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: .5;
  background: #000;
}

.col-xs-10{
  .el-checkbox.is-bordered.el-checkbox.is-bordered{
    margin: 0 20px 10px 0;
  }
}
.verify-error{
  .el-input__inner{
    border: 1px solid #FA5555
  }
}
.person-sign-detail{
  .el-input__inner{
    height: 34px;
    line-height: 34px;
  }
}

// 消息样式 STR
.el-message--warning{
  background-color: #fef8e8;
  border-color: $xy-color-warning;
  .el-icon-warning{
    color: $xy-color-warning;
  }
  .el-message__content{
    color: $xy-text-color-primary;
  }
}

.el-message--success{
  background-color: #f1f7f5;
  border-color: $xy-color-success;
  .el-icon-success{
    color: $xy-color-success;
  }
  .el-message__content{
    color: $xy-text-color-primary;
  }
}

.el-message--error{
  background-color: #ffeeee;
  border-color: $xy-color-danger;
  .el-icon-error{
    color: $xy-color-danger;
  }
  .el-message__content{
    color: $xy-text-color-primary;
  }
}

.el-message--info{
  background-color: #fff;
  border-color: $xy-text-color-placeholder;
  .el-icon-info{
    color: $xy-text-color-placeholder;
  }
  .el-message__content{
    color: $xy-text-color-primary;
  }
}
.el-message{
  min-width: auto;
  padding: 15px 20px;
}
// 消息样式 END

// 启动自动识别立即下载按钮样式 STR
.auto-identify-download{
  color: #fff;
  text-decoration: none;
  :hover{
    text-decoration: none;
  }
  :link{
    text-decoration: none;
  }
  :active{
    text-decoration: none;
  }
  :visited{
    text-decoration: none;
  }
}

// 启动自动识别立即下载按钮样式 END
.el-button--success.is-disabled,
.el-button--success.is-disabled:active,
.el-button--success.is-disabled:focus,
.el-button--success.is-disabled:hover {
  border-color: transparent;
}

// 优化TAB页“x”显示位置使得可以居中 [HOP 2018-05-16]
.el-tabs__item .el-icon-close:before {
  position: relative;
  top: -1px;
}

// TIP悬浮 背景色
.el-tooltip__popper.is-dark {
  background: rgba(51,51,51,.8) !important;
}

.nullList{
  position: relative;
  margin: 200px auto;
  text-align: center;
}

// 小手
.cursor{
  cursor: pointer;
}

.el-dialog__footer{
  text-align: center;
}

input[type=file]{
  display: none;
}

.ft10 {
  float: left;
  margin-top: 10px;
}

.h40{
  height: 40px;
}
.el-time-panel__content::after, .el-time-panel__content::before{
  top:54%;
}
.el-color-picker {
  position: absolute;
  left: 197px;
  top: 0px;
  line-height: normal;
  height: 40px;
}
.xy-search .el-date-editor {
  height: 34px;
  width: 225px !important;
}
.el-tabs__header{
  height: 40px;
}
.ql-container.ql-snow{
  border: none;
  height: 334px;
}

// polyv 直播播放器 输入密码input框
.plv_p_i{
  color: #000 !important;
}